<template>
<section class="wrap">
    <button class="prev_action" type="button" :data-bs-target="target" data-bs-slide="prev">
              <div class="img_bg_left"   >
              <img :src="require(`@/assets/left.png`)" alt="" class="pre_img">
              </div>
     </button>
    
     <slot name="carousel_content"></slot>
    
     <button class="next_action" type="button" :data-bs-target="target" data-bs-slide="next">
          <div class="img_bg_right" >
          <img :src="require(`@/assets/right.png`)" alt=""   class="next_img">
        </div>
    </button>
    
    
    </section>
 </template>
 <script>
     import 'bootstrap/dist/js/bootstrap.bundle.min.js';
    export default{
        name:'HorizonScroll',
        props:['target'],
       
    }
</script>
<style lang="scss" scoped>
    @import '@/Style/bootstrap.min.css';
    @import '@/Style/scss/Horizonscroll.scss';
    
   
</style>